<template>
  <router-view/>
</template>

<script setup lang="ts">
import {useRoute} from "vue-router";
import {watch} from "vue";
import {getMenuByPath} from "@/base/ts/service/AuthService.ts";
import {i18n} from "@/base/ts/service/I18nService.ts";
import {stores} from "@/base/stores";
import {env} from "@/base/ts/utils/env.ts";

const route = useRoute();


watch(() => route.fullPath, (newValue: any, oldValue: any) => {
  changeTitle(getMenuByPath(newValue)?.name)
})

watch(() => stores().cache.lang, (newValue: any, oldValue: any) => {
  changeTitle(getMenuByPath(route.fullPath)?.name)
})

function changeTitle(title?: string) {
  const projectName = i18n(env('project_name'));
  title = i18n(title);
  document.title = title ?   projectName + '⎮' + title : projectName!;
}
</script>
<style lang="scss">
</style>
